<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/one.css" />
		<link rel="stylesheet" type="text/css" href="css/two.css" />
		<script src="js/index.js"></script>
	</head>

	<body>

		<div class="head">
			<div class="notice">
				<img src="image/message.png" class="head-icon" class="head-w" class=right-img/>
			</div>
			<span class="title">
				Mall商城
			</span>
			<div class="right-wrapper" class="head-icon">
				<img src="image/two.png" class="head-icon" />
				<img src="image/e.png" class="head-icon" />
				<img src="image/ae.png" class="head-icon" />
			</div>
		</div>

		<!--首页开始-->
		<div class="index-page" id="indexPageContent">
			<!-- 首页开始 -->
      		<div class="index-page" id="indexPageContent">
        		<div class="index-wrapper">
          			<a class="ig" href="#"><img src="./image/lunbotu.png" /></a>
        		</div>
        		<!-- 导航条开始 -->
        		<div class="index-nav">
          			<div class="function">
            			<div class="item" id="Talk">
              				<img src="./image/huati.png" alt="" class="Img6" />
              				<span class="fontSize4 mt1">话题</span>
            			</div>
            			<div class="item" id="Youxuan">
              				<img src="./image/youxuan.png" alt="" class="Img6" />
              				<span class="fontSize4 mt1">优选</span>
            			</div>
            			<div class="item">
              				<img src="./image/tehui.png" alt="" class="Img6" />
              				<span class="fontSize4 mt1">特惠</span>
            			</div>
            			<div class="item">
              				<img src="./image/qiandao.png" alt="" class="Img6" />
              				<span class="fontSize4 mt1">签到</span>
            			</div>
          			</div>
        		</div>
        		<!-- 导航条结束 -->
        		<!-- 喇叭开始 -->
        		<div class="index-horn">
          			<div class="horn-left">
            			<img src="./image/laba.png" alt="" class="Img6" />
            			<span class="ml6 fontSize3">自营家电清洗服务上线</span>
          			</div>
          			<div class="horn-right">
            			<span class="fontSize3 active-color">详情</span>
          			</div>
        		</div>
        	</div>	
        		<!-- 喇叭开始 -->
		</div>
		<!--首页结束-->

		<!--分类开始-->
		<div class="category-page" id="categoryPageContent">
			<div class="category-left">
          		<div class="function" id="category-page">
            		<div class="item category-active" id="pageOne">
              			<span class="fontSize4">服装</span>
            		</div>
            		<div class="item" id="pageTwo">
              			<span class="fontSize4">餐厨</span>
            		</div>
            		<div class="item" id="pageThree">
              			<span class="fontSize4">配件</span>
            		</div>
            		<div class="item" id="pageFour">
              			<span class="fontSize4">居家</span>
            		</div>
            		<div class="item" id="pageFine">
              			<span class="fontSize4">洗护</span>
            		</div>
            		<div class="item" id="pageSex">
              			<span class="fontSize4">婴童</span>
            		</div>
            		<div class="item" id="pageSeven">
              			<span class="fontSize4">杂货</span>
            		</div>
            		<div class="item" id="pageEight">
              			<span class="fontSize4">饮食</span>
            		</div>
            	</div>
          	</div>
        	
        	<!-- 第一个页面 -->
        	<div class="category-right" id="page1">
          		<div class="function">
            		<div class="item">
              			<img src="./image/nk.png" alt="" class="Img9 mt-2" />
              			<span class="fontSize3">内裤</span>
            		</div>
            		<div class="item">
              			<img src="./image/ny.png" alt="" class="Img9 mt-2" />
              			<span class="fontSize3">内衣</span>
            		</div>
            		<div class="item mt4">
              			<img src="./image/wz.png" alt="" class="Img9 mt-2" />
              			<span class="fontSize3">袜子</span>
            		</div>
            		<div class="item mt4">
              			<img src="./image/dy.png" alt="" class="Img9 mt-2" />
              			<span class="fontSize3">大衣</span>
            		</div>
            		<div class="item mt4">
              			<img src="./image/jiajufu.png" alt="" class="Img9 mt-2" />
              			<span class="fontSize3">家居服</span>
            		</div>
            		<div class="item mt4">
              			<img src="./image/cs.png" alt="" class="Img9 mt-2" />
              			<span class="fontSize3">衬衫</span>
            		</div>
            		
          		</div>
        	</div>
		</div>

		
		<!--分类结束-->

		<!--专题开始-->
		<div class="theme-page" id="themePageContent">
			<!--顶部左右横向滑动-->
			<div class="move-wrapper" id="moveWrapper">
				<div class="all-wrapper" id="allWrapper">
					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>

					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>

					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>

					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>

					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>

					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>

					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>

					<div class="item">
						<div class="img"></div>
						<span class="desc">全部专题</span>
					</div>
				</div>
			</div>

			<div class="theme-content">
				<div class="item">
					<div class="shop-wrapper">
						<div class="img"></div>
						<div>橱窗专题</div>
					</div>
					<!--图片-->
					<div class="img-wrapper">
						<div class="img">这是图片</div>
						<span>热门</span>
					</div>
					<!--商品详情-->
					<div class="detail-wrapper">
						<div class="name-price">
							<span class="name">五个春天的提案</span>
							<span class="price">￥99元起</span>
						</div>
						<div class="detail">
							餐厨起居好物
						</div>
					</div>
					<div class="option-wrapper">
						<div class="left-wrapper">
							<div class="like">
								<img src="image/u193.png" alt="" />
								<span>100</span>
							</div>
							<div class="read-nums">
								<img src="image/u194.png" alt="" />
								<span>10000</span>
							</div>
						</div>
						<div class="right-wrapper">
							<div class="remark">
								<img src="image/u195.png" alt="" />
								<span>500</span>
							</div>
							<img class="arrow-img" src="image/u196.png" alt="" />
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--专题结束-->

		<!--中间开始-->
		<div class="content-wrapper">
			<!--我的开始-->
			<div class="mine-wrapper" id="minePageContent">
				<!--我的结束-->
				<div class="head-bac">
					<img src="image/u208.png" />
					<div class="user-info-wrapper">
						<div class="username">
							Winder
						</div>
						<div class="vip">
							黄金会员
						</div>
					</div>
					<div class="right-arrow">
						<div class="head-bac">
							<img src="image/u211.png" />
						</div>
					</div>
				</div>
				<!--积分优惠关注-->
				<div class="head-flow">
					<div class="item">
						<span class="title">积分</span>
						<span class="number">100</span>
					</div>
					<div class="item">
						<span class="title">优惠劵</span>
						<span class="number">100</span>
					</div>
					<div class="item">
						<span class="title">关注</span>
						<span class="number">100</span>
					</div>
				</div>
				<div class="service-wrapper">
					<div class="function">
						<div class="item">
							<img src="image/mydingdan.png" />
							<span>我的订单</span>
						</div>
						<div class="item">
							<img src="image/daifukuang.png" />
							<span>待付款</span>
						</div>
						<div class="item">
							<img src="image/daishouhuo.png" />
							<span>待收货</span>
						</div>
						<div class="item">
							<img src="image/daipingjia.png" />
							<span>待评价</span>
						</div>
						<div class="item">
							<img src="image/shouhoufuwu.png" />
							<span>售后服务</span>
						</div>
					</div>
					<div class="collet-my">
						<div class="function">
							<div class="item">
								<img src="image/aixing.png" />
								<span>我的收藏</span>
							</div>
							<div class="item">
								<span class="title">商品</span>
								<span class="number">100</span>
							</div>
							<div class="item">
								<span class="title">专题</span>
								<span class="number">100</span>
							</div>
							<div class="item">
								<span class="title">话题</span>
								<span class="number">100</span>
							</div>
						</div>
					</div>
				</div>
				
				<!-- 个人中心开始 -->
        		<div class="peo-wrapper">
          			<div class="function">
            			<div class="item">
              				<div class="left">
                				<img src="./image/zuji.png" alt="" />
                				<span class="jianju-l">我的足迹</span>
              				</div>
              				<div class="right">
                				<span class="jianju-r">10</span>
                				<img src="./image/sxjt.png" alt="" />
              				</div>
            			</div>
            			<div class="item">
              				<div class="left">
                				<img src="./image/wdpj.png" alt="" />
                				<span class="jianju-l">我的评价</span>
              				</div>
              				<div class="right">
                				<span class="jianju-r">10</span>
                				<img src="./image/sxjt.png" alt="" />
              				</div>
            			</div>
            			<div class="item">
             				 <div class="left">
               					<img src="./image/dizhi.png" alt="" />
                				<span class="jianju-l">地址管理</span>
              				</div>
              				<div class="right">
                				<img src="./image/sxjt.png" alt="" />
              				</div>
            			</div>
          			</div>
        		</div>
        		<!-- 个人中心结束 -->
        		<!-- 个人设置开始 -->
        		<div class="peoshezhi-wrapper">
          			<div class="function">
            			<div class="item">
              				<div class="left">
                				<img src="./image/huiyuan.png" alt="" />
                				<span class="jianju-l">我的会员</span>
              				</div>
              				<div class="right">
                				<span class="jianju-r">黄金会员</span>
                				<img src="./image/sxjt.png" alt="" />
              				</div>
            			</div>
            			<div class="item">
              				<div class="left">
                				<img src="./image/fuwuzx.png" alt="" />
                				<span class="jianju-l">服务中心</span>
              				</div>
              				<div class="right">
                				<img src="./image/sxjt.png" alt="" />
              				</div>
            			</div>
            			<div class="item">
              				<div class="left">
                				<img src="./image/shezhi.png" alt="" />
                				<span class="jianju-l">系统设置</span>
              				</div>
              				<div class="right">
                				<img src="./image/sxjt.png" alt="" />
              				</div>
            			</div>
          			</div>
        		</div>
        		<!-- 个人设置结束 -->
			</div>

			
			
			<!--底部tab开始-->
			<div class="foot">
				<div class="item" id="indexPage">
					<img src="image/shouye.png" />
					<span class="item-text">首页</span>
				</div>
				<div class="item" id="categoryPage">
					<img src="image/gongnen.png" />
					<span class="item-text">分类</span>
				</div>
				<div class="item" id="themePage">
					<img src="image/fenlei.png" />
					<span class="item-text">专题</span>
				</div>
				<div class="item" id="userPage">
					<img src="image/my.png" />
					<span class="item-text item-text-select">我的</span>
				</div>
			</div>
		
	</body>

</html>